<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="./js/ctx.js"></script>
</head>
<body>
<div id="cesiumContainer"></div>
<div id="toolbar"></div>
<script>
    var initCesium = new InitCesium();
    var viewer = initCesium.initViewer('cesiumContainer', {
        terrainProvider: Cesium.createWorldTerrain()
    });
    viewer.scene.globe.depthTestAgainstTerrain = false;

    var tileset = new Cesium.Cesium3DTileset({ url: Cesium.IonResource.fromAssetId(6074) });
    viewer.scene.primitives.add(tileset);

    tileset.readyPromise.then(function(){
        var boundingSphere = tileset.boundingSphere;
        viewer.camera.viewBoundingSphere(boundingSphere, new Cesium.HeadingPitchRange(0.0, -0.5, boundingSphere.radius + 500.0));
        viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);
    });

    var entity = viewer.entities.add({
        polygon : {
            hierarchy : new Cesium.PolygonHierarchy(Cesium.Cartesian3.fromRadiansArray([-1.3194369277314022, 0.6988062530900625, -1.3193955980204217, 0.6988091578771254, -1.3193931220959367, 0.698743632490865, -1.3194358224045408, 0.6987471965556998])),
            material : Cesium.Color.RED.withAlpha(0.5),
            classificationType : Cesium.ClassificationType.BOTH
        }
    });

    var options = [{
        text : 'Classify Both',
        onselect : function() {
            entity.polygon.classificationType = Cesium.ClassificationType.BOTH;
        }
    }, {
        text : 'Classify Terrain',
        onselect : function() {
            entity.polygon.classificationType = Cesium.ClassificationType.TERRAIN;
        }
    }, {
        text : 'Classify 3D Tiles',
        onselect : function() {
            entity.polygon.classificationType = Cesium.ClassificationType.CESIUM_3D_TILE;
        }
    }];
    Sandcastle.addToolbarMenu(options);

</script>
</body>
</html>